/*reset css 重置浏览器自带默认样式 保证不同终端显示一致*/
/*所有的标签和伪类 before after*/
*,
::before,
::after{
    padding:0;
    margin:0;

    /*移动端特殊设置*/
    /*清除点击高亮效果*/
    -webkit-tap-highlight-color: transparent;

    /*设置所有的盒子的宽度以边框开始计算*/
    -webkit-box-sizing: border-box;/*要兼容webkit浏览器内核厂商 一般是老的终端浏览器*/
    box-sizing: border-box;
}

body{
    font-size: 14px;
    color: #333;
    /*设备默认字体*/
    font-family:"Microsoft YaHei" ,"sans-serif";/*后一个是设备默认字体*/
}

ul,ol{
    list-style: none;
}

a{
    /*链接下划线*/
    text-decoration: none;
    color: #333;
}
a:hover{
    color: #333;
}

input,
textarea{
    border:none;
    /*清除轮廓线*/
    outline:none;
    /*不允许用户自己拉伸*/
    resize: none;
    /*特殊的属性定义 清楚浏览器给input自带的样式*/
    -webkit-appearance: none;/*组件默认样式为空*/
}

/*common css 公用css*/
.f_left{
    float: left;
}
.f_right{
    float: right;
}
.clearfix::after,
.clearfix::before{
    content: ".";
    line-height:0;
    height:0;
    display: block;
    visibility: hidden;
    clear: both;
}
/*.clearfix{*/
    /*zoom: 1;*/
/*}*/

.m_r10{
    margin-right: 10px;
}
.m_l10{
    margin-left: 10px;
}
.m_t10{
    margin-top: 10px;
}
.m_b10{
    margin-bottom: 10px;
}
.mainColor{
    color: #d8505c;
}

/*所有使用精灵图class  以icon_开始的所有class都有这些属性*/
[class^="icon_"]{  /*这里使用了属性选择器*/
    background: url("../images/sprites.png") no-repeat;
    /*压缩背景图,原图是400*400 */
    background-size: 200px 200px;
}

/*顶部通栏*/
.jd_topBar{
    height:45px;
    background: url("../images/header-bg.png") repeat-x;
    background-size:1px 44px;
    border-bottom: 1px solid #e0e0e0;
    position: absolute;
    width:100%;
}
/*以icon_开头的元素*/
.jd_topBar [class^="icon_"]{
    width:40px;
    height:44px;
    position: absolute;
    padding:12px 10px;
    /*按钮需要设置偏大，方便用户点击*/
    top:0;
    /*******************************************(C3新属性)这里是以内容区域开始显示（除了内容区域不显示背景）***********************************/
    background-origin:content-box;
    background-clip: content-box;
}
/*按钮大小不变 但是显示的背景区域 要变小*/
.jd_topBar .icon_back{
    left:0;
    /*图片位置定位（精灵图）*/
    background-position: -20px 0;
}
.jd_topBar .icon_menu{
    right:0;
    background-position: -60px 0;
}
.jd_topBar form{
    width:100%;
    padding:0 40px;
}
.jd_topBar form input{
    width:100%;
    height:30px;
    border:1px solid #e0e0e0;
    border-radius: 2px;
    margin-top: 7px;
    text-indent: 15px;
}
.jd_topBar h3{
    text-align: center;
    line-height:44px;
    font-weight:normal;
    font-size: 16px;
}














